#{extends 'main.html'/}
#{set 'moreScripts'}
<script src="https://unpkg.com/lodash@4.17.4/lodash.min.js"></script>
<script src="https://cdn.bootcss.com/element-ui/1.3.7/index.js"></script>
<script src="/tts/public/js/common/json-submit.js"></script>
<script src="/tts/public/js/admin/tutor-index.js"></script>
#{/set}
#{set 'moreCss'}
<link rel="stylesheet" href="https://cdn.bootcss.com/element-ui/1.3.7/theme-default/index.css">
<link rel="stylesheet" href="/tts/public/css/admin/tutor-index.css">
<style>

</style>
#{/set}
<div id="app">
    #{navbar /}
        <div style="display: none">
            <input type="hidden" id="tutor_code" value="${tutor.code}"/>
        </div>


    <div class="container">
        <!-- Page Heading/Breadcrumbs -->
        <div class="row">
            <div class="col-lg-12">
                <h1 class="page-header">导师个人信息维护</h1>
            </div>
            <div align="right">
                <a href="${play.configuration.get("cas.logoutUrl")}">退出</a>
            </div>
        </div>
        <!-- /.row -->
        <div class="row">
            <div class="col-md-12">
                <div class="row" id="basicinfo">
                    <div class="col-md-2 col-xs-4" id="profile-image">
                        <a @click="modifyphoto()">
                            <img class="profile-image" :src="imagePath" alt="" >
                        </a>
                    </div>
                    <div class="col-md-10 col-xs-8">
                        <h1 class="name">{{teacher.name}}<span class="title"> {{teacher.professionalTitle}}</span></h1>
                        <span>是否开放访问<el-switch v-model="teacher.isOpen" @change="changeOpen"></el-switch></span>
                        <div class="profile">
                            <ul>
                                <li>{{teacher.unit}}
                                <li>{{teacher.tutorType}}
                                <li>学科：{{teacher.direction}}
                                <li>荣誉称号：{{teacher.honorTitle}}
                            </ul>
                        </div>
                        <!--//profile-->
                    </div>
                </div>
                <hr>
                <div class="row">
                    <div class="col-md-12">
                        <ul id="myTab" class="nav nav-tabs nav-justified">
                            <li v-for="(theme,index) in themes" :class="{'active':index==0}">
                                <a :href="'#v'+theme.code" data-toggle="tab">
                                    {{theme.name}}
                                </a>
                            </li>
                        </ul>
                        <div id="myTabContent" class="tab-content">
                            <div class="tab-pane fade  in"  v-for="(theme,index) in themes" :id="'v'+theme.code" :class="{'active':index==0}" >
                                <p>
                                    <el-button type="primary" @click="showAddForm(index)" v-show="!showAdd[index]">新增 <i class="el-icon-plus"></i></el-button>
                                    <el-button-group v-show="!showAdd[index]">
                                        <el-button type="primary" icon="arrow-up" @click="up(index)">置顶</el-button>
                                    </el-button-group>
                                    <el-button-group v-show="!showAdd[index]">
                                        <el-button type="primary" icon="circle-check" @click="show(index)">显示</el-button>
                                        <el-button type="primary" icon="circle-cross" @click="hidden(index)">不显示</el-button>
                                    </el-button-group>
                                    <el-button type="primary" @click="saveForm(index)" v-show="showAdd[index]">保存 <i class="el-icon-check"></i></el-button>
                                    <el-button  @click="cancelForm(index)" v-show="showAdd[index]">取消填写 <i class="el-icon-close"></i></el-button>
                                </p>
                                <div v-show="showAdd[index]">
                                    <el-form :model="newItems[index]" ref="ruleForm" :rules="rules" label-width="100px">
                                        <el-form-item label="标题" prop="title">
                                            <el-input v-model="newItems[index].title" placeholder="请输入标题" size="large"></el-input>
                                        </el-form-item>
                                        <el-form-item label="内容" prop="content">
                                            <el-input v-model="newItems[index].content" placeholder="请输入内容" type="textarea" size="large" :autosize="{ minRows: 4, maxRows: 8}"></el-input>
                                        </el-form-item>
                                    </el-form>
                                </div>

                                <el-table
                                        :data="teacher.contents[theme.colTitle]"
                                        height="400"
                                        border
                                        @selection-change="handleSelectionChange(index,$event)"
                                        style="width: 100%">
                                    <el-table-column
                                            type="selection"
                                            width="55">
                                    </el-table-column>
                                    <el-table-column
                                            prop="title"
                                            label="标题"
                                            width="180">
                                    </el-table-column>
                                    <el-table-column
                                            prop="content"
                                            label="内容">
                                    </el-table-column>
                                    <el-table-column
                                            prop="rank"
                                            label="排序"
                                            sortable
                                            width="100">
                                    </el-table-column>
                                    <el-table-column
                                            prop="isOpen"
                                            label="可见?"
                                            sortable
                                            :formatter="formatter"
                                            width="100">
                                    </el-table-column>
                                    <el-table-column inline-template :context="_self" label="操作" width="180">
                                        <span>
                                            <el-button size="small" @click="handleEdit(row)">编辑</el-button>
                                            *{<el-switch
                                                    v-model="row.isOpen"
                                                    @change="switchRow(row)"
                                                    on-text="显示"
                                                    off-text="隐藏">
                                            </el-switch>}*
                                        </span>
                                    </el-table-column>
                                </el-table>

                            <!-- <div class="panel panel-default" v-for="item in sortByRank(teacher.contents[colTitle])" v-if="showItems[index]">
                                    <div class="panel-heading">
                                        {{item.title}}
                                        <div style="float:right">
                                            <el-switch v-model="item.isOpen" on-text="显示" off-text="不显示" :width="70"></el-switch>
                                            排序<el-input-number v-model="item.rank"  size="small"></el-input-number>
                                        </div>
                                    </div>
                                    <div class="panel-body">
                                        {{item.content}}
                                    </div>
                                </div>-->
                            </div>
                        </div>
                    </div>
                </div>

                <el-dialog :title="editFormTitle" v-model="editFormVisible" :close-on-click-modal="false">
                    <el-form :model="editForm" label-width="80px" :rules="rules2" ref="editForm">
                        <el-form-item label="标题" prop="title">
                            <el-input v-model="editForm.title" auto-complete="off"></el-input>
                        </el-form-item>
                        <el-form-item label="内容" prop="content">
                            <el-input type="textarea" v-model="editForm.content"></el-input>
                        </el-form-item>
                        <el-form-item label="排序" prop="rank">
                            <el-input-number v-model="editForm.rank" :min="0" :max="100"></el-input-number>
                        </el-form-item>
                    </el-form>
                    <div slot="footer" class="dialog-footer">
                        <el-button @click.native="editFormVisible = false">取 消</el-button>
                        <el-button type="primary" @click.native="editSubmit">{{btnEditText}}</el-button>
                    </div>
                </el-dialog>

                <hr>
            </div>

            <!-- Related Projects Row -->
            <!-- /.row -->

            <hr>
        </div>
    </div>
</div>

